.accounts-form {
  gap: 15px;
  label {
    font-weight: normal;
  }
}
.toolbar {
  width: 100%;
  height: 35px;
  line-height: 35px;
  // background-color: rgb(172, 169, 169);
  // background-image: linear-gradient(
  //   to bottom,
  //   rgb(39, 87, 132),
  //   rgb(165, 168, 170),
  //   rgb(195, 195, 195)
  // );
  align-items: center;
  background: linear-gradient(90deg, #ffffff66, #0000001a, #ffffff33), #4580c4;
  border: 1px solid rgba(0, 0, 0, 0.7);
  border-radius: 6px 6px 0 0;
  box-shadow: inset 0 0 0 1px #fff9;
  display: flex;
  font: 9pt Segoe UI, SegoeUI, Noto Sans, sans-serif;
  justify-content: space-between;
  padding: 6px;
  margin-top: 15px;
  & > * {
    float: right;
    margin-top: 2px;
    margin-left: 15px;
  }
  // margin-bottom: 15px;
}

.btn-area {
  display: flex;
  gap: 15px;
}

.xp-btn {
  font-family: "Pixelated MS Sans Serif", Arial;
  -webkit-font-smoothing: antialiased;
  font-size: 9pt;
  padding: 3px 8px;
  box-sizing: border-box;
  border: 1px solid #003c74;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 1) 0%,
    rgba(236, 235, 229, 1) 86%,
    rgba(216, 208, 196, 1) 100%
  );
  box-shadow: none;
  border-radius: 3px;
  &:not(:disabled) {
    &:active,
    &.active {
      box-shadow: none;
      background: linear-gradient(
        180deg,
        rgba(205, 202, 195, 1) 0%,
        rgba(227, 227, 219, 1) 8%,
        rgba(229, 229, 222, 1) 94%,
        rgba(242, 242, 241, 1) 100%
      );
    }
    &:hover {
      box-shadow: inset -1px 1px #fff0cf, inset 1px 2px #fdd889,
        inset -2px 2px #fbc761, inset 2px -2px #e5a01a;
    }
  }
  &:focus,
  &.focused {
    box-shadow: inset -1px 1px #cee7ff, inset 1px 2px #98b8ea,
      inset -2px 2px #bcd4f6, inset 1px -1px #89ade4, inset 2px -2px #89ade4;
  }
  &::-moz-focus-inner {
    border: 0;
  }
}
